<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
	$(function() {
		var chart;

		$(document).ready(function() {

			// Build the chart
			$('#container').highcharts({
				chart : {
					plotBackgroundColor : null,
					plotBorderWidth : null,
					plotShadow : false
				},
				title : {
					text : 'Browser market shares at a specific website, 2010'
				},
				tooltip : {
					pointFormat : '{series.name}: <b>{point.percentage}%</b>',
					percentageDecimals : 1
				},
				plotOptions : {
					pie : {
						allowPointSelect : true,
						cursor : 'pointer',
						dataLabels : {
							enabled : false
						},
						showInLegend : true
					}
				},
				series : [ {
					type : 'pie',
					name : 'Browser share',
					data : [ [ 'Firefox', 45.0 ], [ 'IE', 26.8 ], {
						name : 'Chrome',
						y : 12.8,
						sliced : true,
						selected : true
					}, [ 'Safari', 8.5 ], [ 'Opera', 6.2 ], [ 'Others', 0.7 ] ]
				} ]
			});
		});

	});
</script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
